import React, { useState } from "react";
import './Recommend.css'

const Recommend = () => {
    const [ recommendData ] = useState([
        {
            "id": 1,
            "title": '合作/招聘',
            "img": 'https://p0.meituan.net/linglong/d85dcb2cfae8f9808184ad8988c11f796555.png',
        },
        {
            "id": 2,
            "title": '美团借钱',
            "img": 'https://p1.meituan.net/linglong/4477bd5dc6575c2846544f84551f060e2214.png',
        },
        {
            "id": 3,
            "title": '充电宝加盟',
            "img": 'https://p0.meituan.net/linglong/d11d330ebd50b0aa30199622d2dca238909.png'
        },
        {
            "id": 4,
            "title": '规则中心',
            "img": 'https://p0.meituan.net/linglong/fbe2eee6853f86d3c8018827522c44c7958.png'
        },
        {
            "id": 5,
            "title": '团长招募',
            "img": 'https://p0.meituan.net/linglong/b2efe2d8a12e1319b1045a59980f03091139.png'
        }
    ])
    return (
        <>
            <div className="recommend-container">
                <div className="recommend-tabbar">推荐工具</div>
                <div className="recommend-hd">
                    {
                        recommendData.map((item,index) => {
                            return (
                                <div className="recommend-box" key={index}>
                                    <img src={item.img} alt="" />
                                    <div className="recommend-title">{item.title}</div>
                                </div>
                            )
                        })
                    }
                </div>
                <div className="recommend-img1">
                    <img src="https://p0.meituan.net/linglong/c707a147616b15c6b4ccd00b2bea11391559.png" />
                </div>
                <div className="recommend-img2">
                    <img src="https://p1.meituan.net/linglong/ce8151e712f00279157e24574e6491314487.png" />
                </div>
                <div className="recommend-bottom"></div>
            </div>
        </>
    )
}

export default Recommend